<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page trimDirectiveWhitespaces="true"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="Cache-Control" content="no-cache,must-revalidate">
		<title>注册-个人用户</title>
		<link type="text/css" rel="stylesheet" href="/css/regist.personal.css" />
		<link type="text/css" rel="stylesheet" href="/css/passport.base.css" />
		<script type="text/javascript" src="/js/jquery-1.6.4.js"></script>
</head>
<body>
	<div class="w" id="logo">
		<div>
			<a href="http://www.taotao.com"> <img
				src="/images/logo-dingdong.png" />
			</a> <b></b>
		</div>
	</div>

	<div class="w" id="regist">
		<div class="mt">
			<ul class="tab">
				<li class="curr">个人用户</li>
			</ul>
			<div class="extra">
				<span>我已经注册，现在就&nbsp; <a href="/page/showLogin" class="flk13">登录</a>
				</span>
			</div>
		</div>
		<div class="mc">
			<form id="personRegForm" method="post" onsubmit="return false;">
				<div class="form" onselectstart="return false;">
					<div class="item" id="select-regName">
						<span class="label"><b class="ftx04">*</b>用户名：</span>

						<div class="fl item-ifo">
							<div class="o-intelligent-regName">
								<input type="text" id="regName" name="username" class="text"
									tabindex="1" autoComplete="off" onpaste="return false;"
									value=""
									onfocus="if(this.value=='') {this.value='';this.style.color='#333'}"
									onblur="if(this.value=='') {this.value='';this.style.color='#999999'}else{usernameBlur()}" />
								<i class="i-name"></i>
								<ul id="intelligent-regName" class="hide"></ul>
								<label id="regName_succeed" class="blank"></label> <label
									id="regName_error" class="hide"></label>
							</div>
						</div>
						<p style="position:absolute;right:10px"></p>
					</div>
					<div id="o-password">
						<div class="item">
							<span class="label"><b class="ftx04">*</b>密码：</span>

							<div class="fl item-ifo">
								<input type="password" id="pwd" name="password" class="text"
									tabindex="2" style="ime-mode: disabled;"
									onpaste="return  false" autocomplete="off"
									onblur="if(this.value!='') pwdBlur()" />
								<i class="i-pass"></i> <label id="pwd_succeed" class="blank"></label>
								<label id="pwd_error"></label> <span class="clr"></span>
							</div>
							<p style="position:absolute;right:10px"></p>
						</div>
						
						<div class="item">
							<span class="label"><b class="ftx04">*</b>确认密码：</span>

							<div class="fl item-ifo">
								<input type="password" id="pwdRepeat" name="pwdRepeat"
									class="text" tabindex="3" onpaste="return  false"
									autocomplete="off" /> <i class="i-pass"></i> <label
									id="pwdRepeat_succeed" class="blank"></label> <label
									id="pwdRepeat_error"></label>
							</div>
						</div>
					</div>
					<div class="item">
						<span class="label">&nbsp;</span> <input type="button"
							class="btn-img btn-regist" id="registsubmit" value="立即注册"
							tabindex="8" clstag="regist|keycount|personalreg|07"
							onclick="REGISTER.reg();" />
					</div>
				</div>
			
				<span class="clr"></span>
			</form>
				<div>
					<p>
						<b>用户名：3-8位 ，数字、字母</b>
					</p>
					<p>
						<b>密码：6-12位 ，数字、字母、符号（支持：~！@#￥%……&*（）+-={}[]|,.>&?等 ）</b>
					</p>
				</div>
		</div>
		<script type="text/javascript">

	


	var REGISTER={
		param:{
			//单点登录系统的url
			surl:""
		},
		inputcheck:function(){
				//不能为空检查
				if ($("#regName").val() == "") {
					alert("用户名不能为空");
					$("#regName").focus();
					return false;
				}
				
				if ($("#pwd").val() == "") {
					alert("密码不能为空");
					$("#pwd").focus();
					return false;
				}
				
				//密码检查
				if ($("#pwd").val() != $("#pwdRepeat").val()) {
					alert("确认密码和密码不一致，请重新输入！");
					$("#pwdRepeat").select();
					$("#pwdRepeat").focus();
					return false;
				}
				return true;
		},
		beforeSubmit:function() {
				//检查用户是否已经被占用
				$.ajax({
	            	url : REGISTER.param.surl + "/user/check/"+escape($("#regName").val())+"/1?r=" + Math.random(),
	            	success : function(data) {
	            		if (data.data == 12) {
					           REGISTER.doSubmit();
	            		} else {
	            			alert("此用户名已经被占用，请选择其他用户名");
	            			$("#regName").select();
	            		}	
	            	}
				});
		},
		doSubmit:function() {
			$.post("/user/register",$("#personRegForm").serialize(), function(data){
				JSON.stringify(data);
				if(data.status == 200 && data.data == true){
					alert('用户注册成功，请登录！');
					REGISTER.login();
				} else {
					alert("注册失败！");
				}
			});
		},
		login:function() {
			 location.href = "/page/showLogin";
			 return false;
		},
		reg:function() {
			if (this.inputcheck()) {
				this.beforeSubmit();
			}
		}
	};
	
	
	var usernameBlur = function (){
		$.ajax({
        	url : REGISTER.param.surl + "/user/check/"+escape($("#regName").val())+"/1?r=" + Math.random(),
        	success : function(data) {
        		var obj = $("#select-regName").children(":last");
        		if (data.data == 12) {
        			obj.html("恭喜！此用户可以使用");obj.css("color","green");
        		} else if(data.data == 13){
        			obj.html("格式不合法");obj.css("color","red");
        		}else{
        			obj.html("此用户名已经被占用，请选择其他用户名");obj.css("color","red");
        		}	
        	}
		});
	}
	
	var pwdBlur = function (){
		$.ajax({
        	url : REGISTER.param.surl + "/user/check/"+escape($("#pwd").val())+"/2?r=" + Math.random(),
        	success : function(data) {
        		var obj2 = $("#o-password").children(":first").children(":last");
        		if (data.data == 13) {
        			obj2.html("格式不合法").css("color","red");
        		} else {
        			obj2.html("合法").css("color","green");
        		}	
        	}
		});
	}
</script>
</body>
</html>
